<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css" media="screen" />
		<link rel="stylesheet" type="text/css" href="03.css">
	</head>
	<body>
		<div class="container">
			<div>
				<br>
				<p><b>当前位置：</b></p>
				<br>
				<p><b>搜索：</b></p>
				<div>
					姓名：<input type="text" style="width: 70px;" /><!-- 单行文本框 长度 -->
					是否启动：<select style="height: 28px;">
						<!-- 下拉列表 -->
						<option>启动</option>
						<option>不启动</option>
					</select>
					身份证号：<input type="text" /><!-- 单行文本框 -->
					角色：<select style="height: 28px;">
						<!-- 下拉解表 -->
						<option>管理员</option>
						<option>学生</option>
					</select>
					<input type="button" style="background-image: url(../01/mages/login/bg.gif);"; width: 50px; height: 30px;" value="搜索" /><!-- 按钮 -->
				</div>
				<br />
			</div>
			<button type="button" class="btn" name="xz" id="butXz">新增</button>
			<button type="button" class="btn" name="sc" id="butSc">删除</button>
			<button type="button" class="btn" name="xg" id="butXg">修改</button>
			<button type="button" class="btn btn_cx" name="cx" id="butCx">查询</button>
			<div data-toggle="buttons">
				<table class="table-striped table-hover" style="width: 100%;">
					<!-- 创建bootstrap表格 隔行变色 鼠标停留变色 -->
					<thead>
						<!-- 表头 -->
						<tr style="height: 40px; font-size: 20px;">
							<th>全选</th>
							<th>姓名</th>
							<th>身份证号</th>
							<th>角色</th>
							<th>是否启用</th>
							<th>创建时间</th>
						</tr>
					<tbody>
						<!-- 表的主体部分 -->
						<tr>
							<td><input type="checkbox" /></td>
							<td>张三</td>
							<td>1230986738291</td>
							<td>老师</td>
							<td>已启用</td>
							<td>2017-7-2</td>
						</tr>
						<tr>
							<td><input type="checkbox" /></td>
							<td>王五</td>
							<td>1230986738345</td>
							<td>老师</td>
							<td>已启用</td>
							<td>2017-7-5</td>
						</tr>
						<tr>
							<td><input type="checkbox" /></td>
							<td>李四</td>
							<td>1230986738291</td>
							<td>老师</td>
							<td>已启用</td>
							<td>2017-7-22</td>
						</tr>
						<tr>
							<td><input type="checkbox" /></td>
							<td>汇鑫</td>
							<td>1230986738291</td>
							<td>老师</td>
							<td>已启用</td>
							<td>2017-12-2</td>
						</tr>
						<tr>
							<td><input type="checkbox" /></td>
							<td>周宪</td>
							<td>1230986738291</td>
							<td>学生</td>
							<td>已停用</td>
							<td>2017-8-2</td>
						</tr>
						<tr>
							<td><input type="checkbox" /></td>
							<td>飞天</td>
							<td>1230986738291</td>
							<td>老师</td>
							<td>已启用</td>
							<td>2017-4-2</td>
						</tr>
						<tr>
							<td><input type="checkbox" /></td>
							<td>aad</td>
							<td>1230986738291</td>
							<td>学生</td>
							<td>已停用</td>
							<td>2017-2-2</td>
						</tr>
						<tr>
							<td><input type="checkbox" /></td>
							<td>特例</td>
							<td>1230986738291</td>
							<td>学生</td>
							<td>已停用</td>
							<td>2017-2-2</td>
						</tr>
						<tr>
							<td><input type="checkbox" /></td>
							<td>李小二</td>
							<td>1230986738291</td>
							<td>学生</td>
							<td>已停用</td>
							<td>2017-2-2</td>
						</tr>
					</tbody>
					</thead>
				</table>
				<div style="position: absolute;bottom: 0;">
					<!-- 使按钮在div最下方 -->
					<button class="btn" name="sy" id="butSy">首页</button><!-- 按钮 -->
					<button class="btn" name="syy" id="butSyy" disabled="true">上一页</button><!-- 按钮 不可选-->
					<button class="btn" name="y" id="butY" disabled="true">1</button><!-- 按钮 不可选-->
					<button class="btn" name="e" id="butE">2</button><!-- 按钮 -->
					<button class="btn" name="xyy" id="butXyy">下一页</button><!-- 按钮 -->
					<button class="btn" name="my" id="butMy">末页</button><!-- 按钮 -->
				</div>
			</div>
	</body>
</html>
